/*
 * @Title: 官方攻略-更多-等级模块
 * @Created by: gsjPC 
 */
<template>
	<view>
		<waterfall-flow :list="list" :loading="loading" @click="choose"></waterfall-flow>
	</view>
</template>

<script>
	import WaterfallFlow from '@/components/nairenk-waterfall-flow/nairenk-waterfall-flow.vue'
	const data = require('../../../common/data.json')
	export default{
		components:{
			WaterfallFlow
		},
		data(){
			return{
				page: 1,
				start: 0,
				list: [], // 列表
				end: 0,
				loading: true
			}
		},
		methods: {
			  choose(item) {
			  	// item 返回选中 JSON 对象
			  	console.log(item)
			  },
			// 模拟加载数据
			getList() {
				if (this.list.length < data.list.length) {
					setTimeout(() => {
						this.end = this.page * 10;
						this.list = this.list.concat(data.list.slice(this.start, this.end));
						this.start = this.end;
						// 延迟 120 毫秒隐藏加载动画，为了跟组件里面的 100 毫秒定位有个平缓过度
						setTimeout(() => {
							this.loading = false;
						}, 120);
					}, 1000)
				} else {
					this.loading = false;
				}
			}
		},
		mounted(){
			  this.getList();
		},
		onReachBottom() {
			this.page++;
			this.loading = true;
			this.getList();
		},
	}
</script>

<style>
</style>
